<template>
  <div>
    <van-row class="top">
      <van-col span="3">
        <van-icon name="setting-o" @click="onClickLeft" />
      </van-col>
      <van-col span="18"></van-col>
      <van-col span="3">
        <van-icon name="share" @click="onClickRight" />
      </van-col>
    </van-row>
    <div class="my">
      <van-image round width="80" height="80" src="https://img.yzcdn.cn/vant/cat.jpeg" />
      <p>{{title}}</p>
      <div>
        <span>{{a}}照片</span>/
        <span>{{b}}关注</span>/
        <span>{{c}}粉丝</span>
      </div>
    </div>
    <div class="shoucang">
      <p>我的收藏</p>
      <span>{{d}}商户</span>/
      <span>{{e}}攻略</span>/
      <span>{{f}}专题</span>/
      <span>{{g}}优惠</span>
    </div>
    <hr />
    <div >
      <van-row class="list" to="">
        <van-col span="22">通知</van-col>
        <van-col span="2">
          <van-icon name="arrow" />
        </van-col>
      </van-row>
      <hr />
      <van-row class="list" to="">
        <van-col span="22">我的心愿单</van-col>
        <van-col span="2">
          <van-icon name="arrow" />
        </van-col>
      </van-row>
      <hr />
      <van-row class="list" to="">
        <van-col span="22">我的足迹</van-col>
        <van-col span="2">
          <van-icon name="arrow" />
        </van-col>
      </van-row>
        <hr />
    </div>
  </div>
</template>

<script>
export default {
  name: "My",
  data() {
    return {
      title: "小小幸福",
      a: "0",
      b: "0",
      c: "0",
      d: "0",
      e: "0",
      f: "0",
      g: "0"
    };
  },
  methods: {
    onClickLeft() {
      Toast("返回");
    },
    onClickRight() {
      Toast("按钮");
    }
  }
};
</script>

<style scoped>
.top {
  height: 70px;
  line-height: 70px;
  font-size: 30px;
  padding-left: 15px;
  color: #fff;
  background: #000;
}
.my {
  background: #000;
  text-align: center;
  color: #fff;
  height: 25vh;
}
.my span {
  font-size: 12px;
  margin: 0 20px;
}
.shoucang {
  margin-left: 10px;

  font-size: 17px;
}
.shoucang span {
  text-align: center;
  margin: 0 20px;
  line-height: 8vh;

  font-size: 15px;
}
.list {line-height: 5vh;
padding-left:2vw;
}
</style>